<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"/>
        <title>
            插值+数据绑定 实现联动
        </title>
        <script type="text/javascript" src="../js/vue.js"></script>
    </head>
    <body>
        
        <div id="root">
            <input type="text" v-model="xing"></input> <br/>
            <input type="text" v-model="ming"></input> <br/>
            <span>{{xing.slice(0,3)}}-{{ming}}</span> <br/> <!--不建议写复杂函数-->
        </div>
        
    </body>
    <script type="text/javascript">
        const vm = new Vue({
            el: "#root",
            data:{
                xing: "王",
                ming: "五"
            }
        })
    </script>
</html>